<template>
  <div>
    <Content :styles="{ backgroundColor: '' }">
      <van-checkbox-group v-model="result" ref="checkboxGroup">
        <van-row v-for="item in this.shoplist" :key="item.id">
          <van-col span="4">
            <van-checkbox :name="item"></van-checkbox>
          </van-col>
          <van-col span="20">
            <van-swipe-cell>
              <van-card
               :price="item.detail.numberOrders"
                :desc="item.detail.name"
                :title="item.detail.name"
                :thumb="item.detail.pic"
                class="goods-card"
                :num="item.num"
              >
                <template #footer>
                  <van-stepper v-model="item.num" />
                </template>
              </van-card>
              <template #right>
                <van-button
                  square
                  text="删除"
                  type="danger"
                  class="delete-button"
                  @click="remove(item.detail.id)"
                />
              </template>
            </van-swipe-cell>
          </van-col>
        </van-row>
      </van-checkbox-group>

      <van-submit-bar :price="count" button-text="提交订单">
        <van-checkbox >全选</van-checkbox>
      </van-submit-bar>
    </Content>
  </div>
</template>

<script>
import mixin from "../store/mixin";
import Content from "../components/content/Content";
export default {
  mixins: [mixin],
  components: {
    Content,
  },
  data() {
    return {
      result: [],
      checked: false,
    };
  },
  mounted() {
    console.log(this.shoplist);
  },
  methods: {
    change(){
      if(this.shoplist.length===this.result.length&&this.result.length!=0){
        this.checked=true;
      }else{
        this.checked=false
      }
    },
       checkall() {
      this.$refs.checkboxGroup.toggleAll(this.checked)
      
    },
  },
      computed: {
    count(){
      var num = 0;
      this.result.forEach(item => {
        num += item.num * item.detail.numberOrders
      });
      return num * 100
    },
    
  },

};
</script>
<style lang="scss" scoped>
.van-submit-bar {
  position: fixed;
  bottom: 86px;
}
</style>>
  
